import Vue from 'vue'
import VueRouter from 'vue-router'
import DashBoard from '@/components/DashBoard.vue'
import NProgress from 'nprogress'

Vue.use(VueRouter)

const routes = [
  {
    path: '/login',
    component: () => import('@/components/Login.vue')
  },
  {
    path: '/user/:userId',
    component: () => import('@/components/User.vue'),
    meta: {
      name: '动态参数',
    },
    beforeEnter: (to, from, next) => {
      console.log('进入到/user/:userId 路由所在地');
      next()
    },
    
    
  },
  {
    path: '/dashboard',
    component: DashBoard,
    name: 'Dashboard',
    children: [
       {
          path: '',
          component: () => import('@/components/Home.vue'),
       },
       {
          path: '',
          component: () => import('@/components/UserList.vue'),
       },
       {
          path: '',
          component: () => import('@/components/ShopList.vue'),
       },
       {
          path: '/404',
          component: () => import('@/components/PageNotFound.vue'),
       },
       {
        path: '/',
        component: () => import('@/components/HelloWorld.vue'),
       }
    ]
  }
]

const router = new VueRouter({
  routes,
})

let authorized = true;

router.beforeEach((to, from, next) => {
  console.log('全局前置的导航守卫已执行');
  console.log('from', from);
  console.log('to', to);
  NProgress.start()
  if (to.path != '/login' && !authorized) {
      next('/login')
  } else {
      next()
  }
})

router.afterEach((to, from) => {
  NProgress.done()
  console.log('全局后置导航守卫结束了');
  console.log('from:', from);
  console.log('to:', to);
})

export default router
